
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	template="template/template.xhtml" xmlns:p="http://primefaces.org/ui">
	<ui:define name="title">View customer manage page</ui:define>

	<ui:define name="menu">
		<ul>
			<li><a href='service.jsf'><span>Service</span></a></li>
			<li><a href='taxi.jsf'><span>Taxi</span></a></li>
			<li><a href='map-view.jsf'><span>Map</span></a></li>

			<li class="active"><a href='customer.jsf'><span>Customer</span></a></li>
			<li><a href='user.jsf'><span>User</span></a></li>
			
		</ul>
	</ui:define>

	<ui:define name="main-content">
		<div style="width: 960; height: 500px;">
			<h:form>
				<table align="center" style="width: 80%; color: black;">


					<tr>
						<td width="30%">Name</td>
						<td width="30%"><p:inputText
								value="#{customerBean.customer.customerName}" id="name"
								required="true" requiredMessage="Please enter customer name"
								validator="#{customerBean.validateName}">
								<f:ajax event="blur" render="CustomerNameError"></f:ajax>
							</p:inputText></td>
						<td width="20%"><p:message for="name" id="CustomerNameError"
								style="Color: red; "></p:message></td>
					</tr>

					<tr>
						<td width="30%">Home address</td>
						<td width="30%"><p:inputTextarea cols="50" rows="3"
								value="#{customerBean.customer.homeAddress}" id="homeAddress"
								required="true" requiredMessage="Home address is require">
								<f:ajax event="blur" render="HomeAddressError"></f:ajax>
							</p:inputTextarea></td>
						<td width="20%"><p:message for="homeAddress"
								id="HomeAddressError" style="Color: red; "></p:message></td>
					</tr>

					<tr>
						<td width="30%">Office address</td>
						<td width="30%"><p:inputTextarea cols="50" rows="3"
								value="#{customerBean.customer.officeAddress}"
								id="officeAddress" required="true" requiredMessage="">
								<f:ajax event="blur" render="OfficeAddressError"></f:ajax>
							</p:inputTextarea></td>
						<td width="20%"><p:message for="officeAddress"
								id="OfficeAddressError" style="Color: red; "></p:message></td>
					</tr>

					<tr>
						<td width="30%">Newest address</td>
						<td width="30%"><p:inputTextarea cols="50" rows="3"
								value="#{customerBean.customer.newestAddress}"
								id="newestAddress" required="true" requiredMessage="">
								<f:ajax event="blur" render="NewestAddressError"></f:ajax>
							</p:inputTextarea></td>
						<td width="20%"><p:message for="newestAddress"
								id="NewestAddressError" style="Color: red; "></p:message></td>
					</tr>

					<tr>
						<td width="30%">Home phone</td>
						<td width="30%"><p:inputText maxlength="11"
								value="#{customerBean.customer.homePhone}" id="homePhone"
								required="true" requiredMessage="Home phone is require"
								validator="#{customerBean.validatePhoneNumber}">
								<f:ajax event="blur" render="HomePhoneError"></f:ajax>
							</p:inputText></td>
						<td width="20%"><p:message for="homePhone"
								id="HomePhoneError" style="Color: red; "></p:message></td>
					</tr>

					<tr>
						<td width="30%">Office phone</td>
						<td width="30%"><p:inputText maxlength="11"
								value="#{customerBean.customer.officePhone}" id="officePhone"
								required="false" requiredMessage=""
								validator="#{customerBean.validatePhoneNumber}">
								<f:ajax event="blur" render="OfficePhoneError"></f:ajax>
							</p:inputText></td>
						<td width="20%"><p:message for="officePhone"
								id="OfficePhoneError" style="Color: red; "></p:message></td>
					</tr>

					<tr>
						<td width="30%">Newest phone</td>
						<td width="30%"><p:inputText maxlength="11"
								value="#{customerBean.customer.newestPhone}" id="newestPhone"
								required="false" requiredMessage=""
								validator="#{customerBean.validatePhoneNumber}">
								<f:ajax event="blur" render="NewestPhoneError"></f:ajax>
							</p:inputText></td>
						<td width="20%"><p:message for="newestPhone"
								id="NewestPhoneError" style="Color: red; "></p:message></td>
					</tr>
					<tr>
						<td colspan="2" align="right"><p:commandButton
								action="#{customerBean.update}" type="submit" value="Update">
							</p:commandButton> <p:commandButton action="customer.jsf" type="submit"
								value="Cancel">
							</p:commandButton></td>
						<td></td>
					</tr>


				</table>
			</h:form>
		</div>
	</ui:define>

</ui:composition>








